@page "/gantt-chart/tooltip-template"
@using Syncfusion.Blazor.Gantt
@inherits SampleBaseComponent;

<SampleDescription>
    <p>This sample demonstrates the way of rendering tooltip template for taskbar by mapping template elements to the property of taskbar in <code>TooltipSettings</code>.</p>
</SampleDescription>
<ActionDescription>
    <p>In this demo, the default tooltip in the Gantt Chart component can be customized using the <code>GanttTooltipSettings.TaskbarTemplate</code> property. You can map the datasource ID value or template string directly to this property.</p>
    <p>Tooltip can be enabled or disabled using the <code>ShowTooltip</code> property by setting the value as true or false.</p>
    <p>More information on the Tooltip Template can be found in this <code><a target='_blank' class='code' href='https://blazor.syncfusion.com/documentation/gantt-chart/tooltip/#tooltip-template'>documentation</a></code> section.</p>
</ActionDescription>

<div class="col-lg-12 control-section">
    <div class="content-wrapper">
        <div class="row">
            <SfGantt DataSource="@TaskCollection" Height="450px" Width="100%" ProjectStartDate="@ProjectStart" ProjectEndDate="@ProjectEnd" WorkUnit="WorkUnit.Hour">
                <GanttTaskFields Id="TaskId" Name="TaskName" StartDate="StartDate" EndDate="EndDate" Duration="Duration" Progress="Progress"
                                 ParentID="ParentId" TaskType="TaskType">
                </GanttTaskFields>
                <GanttTooltipSettings ShowTooltip="true" TValue="TaskData">
                    <TaskbarTemplate>
                        <table>
                        @{ 
                            if ((context as TaskData).ResourceName != null)
                            {
                              <tr>
                                <td rowspan="3" style="padding:3px">
                                  <img src="images/gantt/@((context as TaskData).ResourceName.ToLower().Split(" ")[0]).png" height="40" /></td>
                                <td style="padding:3px">Task done By:</td>
                                <td style="padding:3px">@((context as TaskData).ResourceName)</td>
                            </tr>
                            <tr>
                                <td style="padding:3px">Starts On:</td>
                                <td style="padding:3px">@((context as TaskData).StartDate.ToString("MM/dd/yyyy"))</td>
                            </tr>
                            <tr>
                                <td style="padding:3px">Ends On:</td>
                                <td style="padding:3px">@((context as TaskData).EndDate.ToString("MM/dd/yyyy"))</td>
                            </tr>
                            }
                            else {
                                <tr>
                                <td style="padding:3px">Starts On:</td>
                                <td style="padding:3px">@((context as TaskData).StartDate.ToString("MM/dd/yyyy"))</td>
                            </tr>
                            <tr>
                                <td style="padding:3px">Ends On:</td>
                                <td style="padding:3px">@((context as TaskData).EndDate.ToString("MM/dd/yyyy"))</td>
                            </tr>
                            }
                         }
                         </table>
                    </TaskbarTemplate>
                </GanttTooltipSettings>
                <GanttLabelSettings LeftLabel="TaskName" TValue="TaskData"></GanttLabelSettings>
                <GanttSplitterSettings Position="40%"></GanttSplitterSettings>
            </SfGantt>
        </div>
    </div>
</div>

@code{ 
    public DateTime ProjectStart = new DateTime(2019, 3, 23);
    public DateTime ProjectEnd = new DateTime(2019, 7, 28);
    public List<TaskData> TaskCollection { get; set; }
    protected override void OnInitialized()
    {
        this.TaskCollection = GetTaskCollection();
    }

    public class TaskData
    {
        public int TaskId { get; set; }
        public string TaskName { get; set; }
        public string TaskType { get; set; }
        public DateTime StartDate { get; set; }
        public DateTime EndDate { get; set; }
        public string Duration { get; set; }
        public int Progress { get; set; }
        public int? ParentId { get; set; }
        public string ResourceName { get; set; }
    }

    public static List<TaskData> GetTaskCollection()
    {
        List<TaskData> Tasks = new List<TaskData>() {
            new TaskData() {
                TaskId = 1,
                TaskName = "Project initiation",
                StartDate = new DateTime(2019, 03, 28),
                EndDate = new DateTime(2019, 07, 28),
                TaskType ="FixedDuration",
                Duration="4",
            },
            new TaskData() {
                TaskId = 2,
                TaskName = "Identify Site location",
                StartDate = new DateTime(2019, 03, 29),
                Progress = 30,
                ParentId = 1,
                Duration="2",
                ResourceName="Rose Fuller"
            },
            new TaskData() {
                TaskId = 3,
                TaskName = "Perform soil test",
                StartDate = new DateTime(2019, 03, 29),
                ParentId = 1,
                Duration="4",
                Progress = 30,
                TaskType="Fixed work",
                ResourceName="Margaret Buchanan"
            },
            new TaskData() {
                TaskId = 4,
                TaskName = "Soil test approval",
                StartDate = new DateTime(2019, 03, 29),
                Duration = "1",
                Progress = 30,
                ParentId = 1,
                ResourceName="Fuller King",
                TaskType="Fixed work"
            },
            new TaskData() {
                TaskId = 5,
                TaskName = "Market Research",
                StartDate = new DateTime(2019, 03, 29),
                EndDate = new DateTime(2019, 04, 2),
                TaskType="Fixed Duration",
                Duration="4"
            },
            new TaskData() {
                TaskId = 6,
                TaskName = "Demand Analysis",
                StartDate = new DateTime(2019, 03, 29),
                Duration = "3",
                Progress = 30,
                ParentId = 5,
                ResourceName="Van Jack",
                TaskType="Fixed work"
            },
            new TaskData() {
                TaskId = 7,
                TaskName = "Customer Strength",
                StartDate = new DateTime(2019, 04, 01),
                Duration = "3",
                Progress = 30,
                ParentId = 5,
                TaskType="Fixedwork",
                ResourceName="Martin Tamer"
            },
            new TaskData() {
                TaskId = 8,
                TaskName = "Market Opportunity analysis",
                StartDate = new DateTime(2019, 04, 01),
                Duration = "2",
                ParentId = 5,
                Progress = 30,
                TaskType="Fixedwork",
                ResourceName="Jack Davolio"
            },
            new TaskData() {
                TaskId = 9,
                TaskName = "Project estimation",
                StartDate = new DateTime(2019, 03, 31),
                EndDate = new DateTime(2019, 04, 04),
                Duration="5"
            },
            new TaskData() {
                TaskId = 10,
                TaskName = "Develop floor plan for estimation",
                StartDate = new DateTime(2019, 03, 31),
                Duration = "3",
                Progress = 30,
                ParentId = 9,
                ResourceName="Fuller King",
                TaskType="Fixed work"
            },
            new TaskData() {
                TaskId = 11,
                TaskName = "List materials",
                StartDate = new DateTime(2019, 04, 02),
                Duration = "2",
                Progress = 30,
                ParentId = 9,
                TaskType="Fixedwork",
                ResourceName="Martin Tamer"
            },
            new TaskData() {
                TaskId = 12,
                TaskName = "Estimation approval",
                StartDate = new DateTime(2019, 04, 04),
                Duration = "2",
                ParentId = 9,
                Progress = 30,
                TaskType="Fixedwork",
                ResourceName="Margaret Buchanan"
            },
        };
        return Tasks;
    }
}
